<template>
  <el-popover
    class="CommentsSwitch"
    :disabled="!initSwitch"
    trigger="hover">
    <el-button type="primary" slot="reference">评论审核</el-button>
    <el-switch
      v-model="openSwitch"
      :active-value="true"
      :inactive-value="false"
      active-text="开启审核"
      inactive-text="关闭审核"
      @change="changeSwitch"></el-switch>
  </el-popover>
</template>

<script>
export default {
  name: "CommentsSwitch",
  props:{
    commentBusinessType: String
  },
  data(){
    return{
      openSwitch: false,
      initSwitch: false,
    }
  },
  created(){
    this.$yAxios({
      url: this.$api.common.queryCommentsInfoSwitch,
      data:{
        commentBusinessType: this.commentBusinessType
      }
    }, info => {
      this.openSwitch = info;
      this.$nextTick(() => {
        this.initSwitch = true;
      })
    })
  },
  methods:{
    changeSwitch(val, oldVal = !val){
      if(this.initSwitch && val !== oldVal){
        this.$yAxios({
          url: this.$api.common.commentsInfoSwitch,
          data:{
            commentBusinessType: this.commentBusinessType,
            isSwitch: val
          }
        }, info => {
          this.$emit('refresh');
        }, e => {
          this.initSwitch = false;
          this.openSwitch = oldVal;
          this.$nextTick(() => {
            this.initSwitch = true;
          })
        })
      }
    }
  }
}
</script>

<style scoped>

</style>